<template>
  <div id="gashaponList"> 


        <el-table :data="datalist" style="width: 100%" :height="dtheight" :header-cell-style="{background:'#4F81BC',color:'white'}"
           :row-class-name="tableRowClassName"  :border="true">
            
                <el-table-column label="开始时间"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.start }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="结束时间"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.end }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="名称"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.title }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="扭蛋次数"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.must_number }}</span>
                    </template>
                </el-table-column>
                <el-table-column label="人数"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.invite_count }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="经验值"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.experience}}</span>
                    </template>
                </el-table-column>
                <el-table-column :label="variable_name4"  align='center' >                   
                    <template slot-scope="scope">                   
                        <span >{{ scope.row.manor_title }}</span>
                    </template>
                </el-table-column>
                 <el-table-column label="操作" align='center' width="300" fixed="right">
                    <template slot-scope="scope">                           
                        <el-button  size="mini"  type="primary"  plain  @click="reach_but(scope.row)">修改</el-button>  
                        <el-button  size="mini"  type="primary"  plain  @click="go_but(scope.row)">设置奖品</el-button> 
                        <el-button  size="mini"  type="primary"  plain @click="go_user_but(scope.row)">用户列表</el-button>                                       
                    </template>
                </el-table-column>
  
        </el-table> 


           <!-- 修改 -->
    <el-dialog title="修改" :visible.sync="reach_mtk"  width="450px">
        <div style="width:100%;"> 

        <el-form ref="form"   label-width="70px" style="width:100%;">
              
              <el-form-item label="名称">
                    <el-input    v-model="reach_form.title" placeholder="名称"></el-input>
              </el-form-item> 
              <el-form-item label="分享人数">
                    <el-input    v-model="reach_form.people" placeholder="分享人数"></el-input>
              </el-form-item> 
              <el-form-item label="经验值">
                    <el-input    v-model="reach_form.number" placeholder="经验值"></el-input>
              </el-form-item> 
               <el-form-item label="扭蛋次数">
                    <el-input    v-model="reach_form.must_number" placeholder="经验值"></el-input>
              </el-form-item>
              
               <el-form-item :label="'选择' + variable_name4">
                      <el-select  v-model="limits_form.select_num"  placeholder="请选择" style="width:100%;">
                          <el-option  v-for="(item,index) in limits_form.select_data" :key="index" :label="item.title" :value="item.maid"></el-option>
                       </el-select>
                 </el-form-item>

              <el-form-item label="开放时间">
                    <el-date-picker type="date"   placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd"  v-model="reach_form.time1" ></el-date-picker>
              </el-form-item>  
              <el-form-item label="结束时间">
                    <el-date-picker type="date"   placeholder="选择日期" format="yyyy-MM-dd" value-format="yyyy-MM-dd"  v-model="reach_form.time2" ></el-date-picker>
              </el-form-item>   
                                  
            </el-form>

            <div style="text-align: center;width:50%;margin:auto;">
                <el-button type="primary" class="custom_color_button" style="width:80%;"  @click="reach_but_qr">确认</el-button>
            </div>

        </div> 
    </el-dialog>


   </div>
</template>

<script>

export default {
   name: 'gashaponList',
   props:{
      datalist:{  
        //type:Array,
       default:()=>[]
     },
  },
  data () {
    return {
        dtheight:'500',  //窗口高度
        reach_mtk:false,
        reach_form:{
            title:'',
            people:'',
            number:'',
            time1:'',
            time2:'',
            must_number:'',
            id:'',
        },
        limits_form:{
            select_data:[],
            select_num:'',
        },
        prize_mtk:false,
        prize_form:{
            name:'',
            times:'',
            radio:1
        },
    }
  },
   components:{

  },
  created(){
     this.dtheight = window.innerHeight - 298
     this.gz_list()
  },
  mounted (){
    
  },
  methods: { 
        gz_list(){
            this.post("/manor/listOfData", {
                
                }).then(res => {
                    this.limits_form.select_data = res.result.list
                    //console.log(res)
            })
      },
      reach_but(row){
          this.reach_mtk = true
          this.reach_form.title = row.title,
          this.reach_form.time1 = row.start
          this.reach_form.time2 = row.end,
          this.reach_form.people = row.invite_count,
          this.reach_form.number =  row.experience,
          this.limits_form.select_num = row.manor_limit
          this.reach_form.id = row.lsid
          this.limits_form.select_num = row.manor_limit
          this.reach_form.must_number= row.must_number
      },
      reach_but_qr(){
           
           this.post("/lottery_shake/update", {
                    lsid:this.reach_form.id,
                    title:this.reach_form.title,
                    start:this.reach_form.time1,
                    end:this.reach_form.time2,
                    experience:this.reach_form.number,
                    invite_count:this.reach_form.people,
                    must_number:this.reach_form.must_number,
                    manor_limit:this.limits_form.select_num
                }).then(res => {

                    if(res.error_code == 0){
                    this.open1(res.result,'success')  //提示框
                    this.reach_mtk = false
                    this.$emit('up_list_fun')
                    }else {
                    this.open1(res.message,'warning')
                }

             })

      },
      go_but(row){
          this.$router.push({
          path: '/index/prize',
          query: {
            name:row.title,
            id:row.lsid
          }
        })
      },
      go_user_but(row){
          this.$router.push({
          path: '/index/usergashapon',
          query: {
            name:row.title,
            id:row.lsid
          }
        })
      }
  }
}
</script>


<style scoped>

</style>